<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>智慧农业云服务平台</title>
    <link rel="stylesheet" href="/layui/css/layui.css">
    <link rel="stylesheet" type="text/css" href="/css/base.css" />
    <link rel="stylesheet" type="text/css" href="/css/login.css" />
    <style>
        .layui-nav-bar {
            background-color: #344058;
        }
        .layui-layout-admin .layui-logo {
            color: #FFFFFF;
        }
        .layui-layout-left .layui-nav-item a i,.layui-layout-right .layui-nav-item i{
            color: #fff;
            font-size: 16px;
        }
        .layui-nav-tree .layui-nav-child dd.layui-this, .layui-nav-tree .layui-nav-child dd.layui-this a, .layui-nav-tree .layui-this, 		.layui-nav-tree .layui-this > a, .layui-nav-tree .layui-this > a:hover {
            background-color: #13a5da;
            /*background-color: #1e9fff;*/
            color: #fff;
        }
        .layui-layout-right .layui-nav .layui-nav-item i {
            color: #fff;
        }
        .layui-nav-bar {
            background-color: #93ddf8;
        }
        .left-nav-bg {
            background: #344058 !important;
        }
        .layui-nav-tree .layui-nav-item a:hover {
            background-color: #344058;
        }
        .layui-nav-tree .layui-nav-child a:hover {
            background-color: #242d3d;
        }
        .layui-elem-quote {
            border-left: 5px solid #0990cf;
        }
        /*#tree i.layui-tree-branch {
            display: none;
        }*/
        #allmap {width: 100%;height: 85%;overflow: hidden;margin:0;font-family:"微软雅黑";}
        .scene-tree-content {
            overflow: auto;
        }
    </style>
    <script src="/layui/layui.js"></script>
    <script src="/js/artTemplate/template-web.js"></script>
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
    <div class="layui-header" style="background-color:#1ca5ce;/*#16b1ef;*/">
        <div class="layui-logo" style="background-color:#1389b4; /*#0f97e1;*/"><span >智慧农业云服务</span></div>
        <!-- 头部区域（可配合layui已有的水平导航） -->
        <ul class="layui-nav layui-layout-left" style="padding:0px;">
            <li class="layui-nav-item layadmin-flexible" lay-unselect="">
                <a href="javascript:;" layadmin-event="flexible" title="侧边伸缩">
                    <i class="layui-icon layui-icon-shrink-right" id="LAY_app_flexible" ></i>
                </a>
            </li>
            <li class="layui-nav-item">
                <a href="javascript:;">
                    <i class="layui-icon layui-icon-website" id="LAY_app_index" ></i>
                </a>
            </li>
            <li class="layui-nav-item">
                <a href="javascript:;">
                    <i class="layui-icon layui-icon-refresh-3" id="LAY_app_refresh" ></i>
                </a>
            </li>
            <!-- <li class="layui-nav-item">
                <a href="javascript:;">其它系统</a>
                <dl class="layui-nav-child">
                    <dd>
                        <a href="">邮件管理</a>
                    </dd>
                    <dd>
                        <a href="">消息管理</a>
                    </dd>
                    <dd>
                        <a href="">授权管理</a>
                    </dd>
                </dl>
            </li> -->
        </ul>

        <ul class="layui-nav layui-layout-right">
            <li class="layui-nav-item layui-hide-xs" lay-unselect="" style="margin-right:30px;">
                <i class="layui-icon layui-icon-notice" ></i>
            </li>
            <%--<li class="layui-nav-item layui-hide-xs" id="layui-theme" lay-unselect="" style="margin-right:30px;">
                <i class="layui-icon layui-icon-notice" ></i>
            </li>--%>
            <li class="layui-nav-item">
                <i class="layui-icon layui-icon-note pointer" id="layui-MyMsg" title="我的信息" ></i>
            </li>
            <li class="layui-nav-item" style="margin-left:10px;">
                <a href="javascript:;" >
                    <img src="http://t.cn/RCzsdCq" class="layui-nav-img">  <span id="cur-user">-</span>
                </a>
                <dl class="layui-nav-child">
                    <dd>
                        <a href="javascript:;">基本资料</a>
                    </dd>
                    <dd>
                        <a href="javascript:;">安全设置</a>
                    </dd>
                </dl>
            </li>
            <li class="layui-nav-item">
                <a href="http://localhost:8082/admin" >后台管理</a>
            </li>
        </ul>
    </div>

    <div class="layui-side layui-bg-black left-nav-bg">
        <div class="layui-side-scroll">
            <ul class="layui-nav layui-nav-tree nav-left left-nav-bg"  lay-shrink="all" lay-filter="home">
            </ul>
            <ul id="main-nav" class="layui-nav layui-nav-tree left-nav-bg" lay-filter="test">
                <li class="layui-nav-item"><a href="/ift"><i class="layui-icon layui-icon-console"></i>&nbsp;&nbsp;<span>控制台</span></a></li>
                <li class="layui-nav-item layui-nav-itemed">
                    <a class="" href="javascript:;"><i class="layui-icon layui-icon-headset"></i>&nbsp;&nbsp;<span>云监控</span><span class="layui-nav-more"></span></a>
                    <dl class="layui-nav-child">
                        <dd class=""><a href="/ift/monitor">&nbsp;&nbsp;监控面板</a></dd>
                        <dd class=""><a href="/ift/datasearch">&nbsp;&nbsp;数据查询</a></dd>
                        <dd class=""><a href="/ift/manager">&nbsp;&nbsp;综合管理</a></dd>
                        <dd class="layui-this"><a href="/ift/early-warning">&nbsp;&nbsp;预警分析</a></dd>
                    </dl>
                </li>

                <span class="layui-nav-bar" style="height: 0px; top: 317.5px; opacity: 0;"></span>
            </ul>
        </div>
    </div>

    <div class="layui-body layui-right">
        <div class="layui-tab layui-tab-card" lay-allowclose="true" lay-filter="layadmin-layout-tabs" overflow style="margin:0px;padding-bottom: 40px;">
            <%--<ul class="layui-tab-title" id="main-tab" style="background: #fff;border: 0 none;">
                <!--<li class="layui-this" lay-id="/home/controller/" lay-attr="/home/controller/" id="tab-home">
                    <i class="layui-icon layui-icon-home"></i>
                </li>-->
            </ul>--%>
            <div class="layui-card layadmin-header">
                <div class="layui-breadcrumb" lay-filter="breadcrumb" style="visibility: visible;">
                    <a ><cite>云监控</cite></a><span lay-separator="">/</span>
                    <a href="/ift/monitor" lay-href="">预警分析</a>
                </div>
            </div>
            <!--<div class="layui-tabs layui-nav-item" style="position:absolute;top:0px;right:0px;z-index: 9999;cursor:pointer;width: 50px;height: 41px;text-align: center;line-height: 40px;border: solid 1px #f2f2f2;">
                <i class="layui-icon layui-icon-down"></i>
            </div>-->

            <div class="layui-tab-content layui-fluid tab-content" id="main-content">
                <div class="layui-row layui-col-space8">
                    <div class="layui-col-md10">
                        <div class="layui-card-box">
                            <div class="layui-card">
                                <div class="layui-card-header">设备数据 <span style="float: right;" id="equipment"></span></div>
                                <div class="layui-card-body">
                                    <blockquote class="layui-elem-quote quoteBox">
                                        <form class="layui-form">
                                            <div class="layui-input-inline">
                                                所属设备：
                                            </div>
                                            <div class="layui-input-inline">
                                                <select name="powerType" id="equipment-list" lay-filter="equipment-list" lay-search>
                                                    <option value="">请选择设备</option>
                                                </select>
                                            </div>
                                            <div class="layui-input-inline">
                                                检测项目：
                                            </div>
                                            <div class="layui-input-inline">
                                                <select name="powerType" id="checkItem" lay-search>
                                                    <option value="">请选择</option>
                                                </select>
                                            </div>
                                            <div class="layui-input-inline">
                                                预测模型：
                                            </div>
                                            <div class="layui-input-inline">
                                                <select name="powerType" id="model" lay-search>
                                                    <option value="ARIMA">ARIMA</option>
                                                    <option value="LSTM-RNN">LSTM-RNN</option>
                                                    <option value="RandomForest">RandomForest</option>
                                                    <option value="SVM">SVM</option>
                                                </select>
                                            </div>
                                            <div class="layui-input-inline">
                                                采集时间：
                                            </div>
                                            <div class="layui-input-inline">
                                                <input type="text" name="col-time" id="downAcquisitionTime" lay-verify="date" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
                                            </div>
                                            <div class="layui-input-inline">
                                                -
                                            </div>
                                            <div class="layui-input-inline">
                                                <input type="text" name="col-time" id="upAcquisitionTime" lay-verify="date" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
                                            </div>
                                            <div class="layui-inline">
                                                <a class="layui-btn layui-btn-normal search_btn" data-type="reload">开始预测</a>
                                            </div>
                                        </form>
                                    </blockquote>
                                    <%--<table id="tableList" lay-filter="tableList"></table>--%>
                                    <blockquote id="tips" class="layui-elem-quote" style="display:none;background: #f55500;color: #ffffff;opacity: 0.7;border: 0 none;border-radius: 5px;">
                                        预测到接下来的一段时间内，当前通道值可能会超出或低于阈值（见下图红色标记），请及时作出相应的处理
                                    </blockquote>
                                    <div id="echart-content" style="margin: 50px 0;">
                                        <div align="center" id="tip">请选择设备与预测项目</div>
                                        <div style="width: 100%;height: 200px;text-align: center;display: none;" id="loading">
                                            <i style="font-size: 30px !important;line-height: 200px;" class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop"></i>
                                        </div>

                                        <%--<div id="echart-box1" class="layui-elem-quote layui-quote-nm magb0 echart-box">
                                            <div id="line-chart" style="margin-top:10px;width: 95%; height: 400px;">

                                            </div>
                                        </div>--%>
                                    </div>
                                    <script type="text/html" id="toolbarDemo">
                                        <div class="layui-btn-container">
                                            <%--<button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>--%>
                                        </div>
                                    </script>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md2">
                        <div class="layui-card-box">
                            <div class="layui-card">
                                <div class="layui-card-header"><i class="layui-icon layui-icon-location"></i>&nbsp;场景</div>
                                <div class="layui-card-body scene-tree-content">
                                    <div style="width: 100%;height: 200px;text-align: center;" id="tree-scenery">
                                        <i style="font-size: 30px !important;line-height: 200px;" class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop"></i>
                                    </div>
                                    <ul style="height: 100%;" id="tree"></ul>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
        <div class="layui-footer" style="text-align: center;">
            <!-- 底部固定区域 -->
            © 仲恺农业工程学院英东楼109实验室
            <div id="test">

            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="/echarts/echarts.js"></script>
<script type="text/javascript" src="/js/jquery-3.3.1.js"></script>
<script type="text/javascript" src="/js/jquery.cookie.js"></script>
<script type="text/javascript" src="/js/common.js"></script>
    <script type="text/javascript" src="/js/iftmonitor/early-warning.js"></script>
    <!--<script type="text/javascript" src="../../static/js/tabs.js" ></script>-->

</body>

</html>
